<template>
  <a-form-model v-bind="layout" :model="formThree" ref="nodeFormThree" :rules="rulesThree">
    <a-form-model-item v-for="(item,index) in componentList" :label="item.funcGroupName" :key="item.id"
                       :prop="item.funcGroupCode">
      <radio-array v-if="item.funcGroupDataRule=='0'" v-model="formThree[item.funcGroupCode]">
        <a-radio v-for="(childItem,childIndex) in item.funcList" :value="childItem.funcCode" :key="childItem.id">
          {{childItem.funcName}}
        </a-radio>
      </radio-array>
      <a-checkbox-group v-else v-model="formThree[item.funcGroupCode]">
        <a-checkbox v-for="(childItem,childIndex) in item.funcList" :value="childItem.funcCode"
                    :key="childItem.id">
          {{childItem.funcName}}
        </a-checkbox>
      </a-checkbox-group>
    </a-form-model-item>
  </a-form-model>
</template>

<script>
  import {getAction, postAction} from "../../../api/manage";
  import RadioArray from "./RadioArray";

  export default {
    name: "StepThree",
    components: {RadioArray},
    props: ['layout', 'nodeId'],
    data() {
      return {
        loading: false,
        componentList: null,
        formThree: {},
        rulesThree: {}
      }
    },
    created() {
      this.loadComponents();
      if ('add' != this.type) {
        this.loadStepThreeInfo()
      }
    },
    methods: {
      //第三部：请求基础组件数据
      loadComponents() {
        getAction('sys/workflowNode/selectAviFunc').then(res => {
          if (res.success) {
            this.componentList = res.result;
            const rules = {};
            res.result.forEach(item => {
              if (item.funcGroupRequired == 1) {
                rules[item.funcGroupCode] = [{
                  required: true,
                  message: `请选择${item.funcGroupName}`
                }]
              }
            });
            this.rulesThree = rules;
          } else {
            this.$message.error(res.message);
          }
        }).catch(error => {
          console.log(error)
        })
      },
      //加载已经保存的信息
      loadStepThreeInfo() {
        getAction('sys/workflowNode/queryNodeFunc', {nodeId: this.nodeId}).then(res => {
          if (res.success) {
            let form = {};
            //todo:有一个问题，改变组/删除组之后再次保存的问题
            res.result.forEach(item => {
              form[item.groupId] = item.funcList;
            });
            this.formThree = form;
          } else {
            this.$message.error(res.message);
          }
        })
      },
      //保存第三步信息
      saveStepThreeInfo() {
        this.$refs.nodeFormThree.validate(validate => {
          if (validate) {
            this.loading = true;
            const params = {
              nodeId: this.nodeId,
              funcGroup: []
            };
            //遍历对象
            for (let key in this.formThree) {
              const includes = this.componentList.find(item => item.funcGroupCode == key);
              if (includes) {
                let funcList = [];
                const value = this.formThree[key];
                if (typeof value === 'string') {
                  funcList = value.split(',');
                } else if (Array.isArray(value)) {
                  funcList = value;
                }
                if (funcList && funcList.length > 0) {
                  params.funcGroup.push({
                    groupId: key,
                    funcList
                  })
                }
              }
            }
            postAction('sys/workflowNode/bindNodeFuncAndGroup', params).then(res => {
              if (res.success) {
                this.$message.success('保存成功');
                this.$emit('saveSuccess');
              } else {
                this.$message.error(res.message);
              }
            }).catch(error => console.log(error))
              .finally(() => {
                this.loading = false;
              });
          } else {
            return false;
          }
        })
      }
    }
  }
</script>

<style scoped>

</style>